<template>
	<view>
		<uv-navbar
			:leftIconColor="navstyle.txtColor"
			:titleStyle="titleStyle"
			:title="navstyle.title"
			:leftIcon="navstyle.leftIcon"
			:bgColor="navstyle.bgColor"
			:fixed="false"
			@leftClick="leftClick"
			:safeAreaInsetTop="false">
		</uv-navbar>
		<view class="goods" v-for="(item,index) in teamList" :key="index">
			<view class="jzn"></view>
			<view class="fenmo">
				<view class="yingying">
					<view class="caiy">
						订单编号：{{item.orderSn}}
					</view>
					<view class="jzn_fu">
						{{item.status_text}}
					</view>
				</view>
				<view class="pcy">
					<view class="pcy_tu">
						<image :src="item.goodsLogo" mode=""></image>
					</view>
					<view class="pcy_ww">
						<view class="pcy_a">
							{{item.goodsName}}
						</view>
						<view class="qianwang">
							<view class="pcy_b">
								价格：{{item.price}}
							</view>
							
						</view>
						<view class="pcy_rr">
							佣金：{{item.sumPrice}}
						</view>
						<view class="xdsj">下单时间：{{item.create_time_text}}</view>
					</view>
				</view>
			    <view  class="meiemei">
					<view  class="limi">归属人:{{item.sellusername}}</view>
					<view  class="limi">购买人：{{item.buyusername}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {teamOrderList} from '@/api/bonus.js';
	export default{
		data(){
			return{
				navstyle: {
					title: "账户管理",
					txtColor: "#333333",
					bgColor: "#FFFFFF",
					leftIcon: "arrow-left",
				},
				titleStyle: {
					fontWeight: 700
				},
				teamList:[],
			}
		},
		onLoad() {
			teamOrderList().then(response=>{
				this.teamList = response.data.data;
				console.log(this.teamList)
			});
		},
		methods:{
			leftClick() {
				uni.reLaunch({
				  url: '/pages/index/user' // 替换成上一页的路径
				});
			},
		}
	}
</script>

<style>
	.page{
		width: 100%;
		height: 100%;
	}
	.goods{
	    width: 100%;
	    background-color: #fff;
	    box-shadow: 2px 2px 4px #ccc;
	    margin-bottom: 5px;
	    padding-bottom: 16px;
	}
	.jzn{
	    width: 90%;
	    margin: auto;
	    padding-top: 10px;
	    display: flex;
	    justify-content: space-between;
	}
	.yingying{
	    width: 90%;
	    margin: auto;
	    margin-top: 5px;
	    display: flex;
	    justify-content: space-between;
	    align-items: center;
	}
	.caiy{
	    font-size: 14px;
	    color: #80817f;
	}
	.jzn_fu{
	    color: #ea4335;
	}
	.pcy{
	    width: 96%;
	    padding: 3px 10px 1px 10px;
	    display: flex;
	    justify-content: space-between;
	}
	.pcy_tu {
	    width: 24%;
	    padding: 10px;
	}
	.pcy_tu image{
	    width: 100%;
	    height: 106px;
	    border-radius: 10px;
	}
	.pcy_ww{
	    width: 64%;
	    padding: 8px;
	    font-size: 14px;
	}
	.pcy_a{
	    margin: auto;
	    font-size: 17px;
	    font-weight: 700;
	    margin-bottom: 10px;
	}
	.qianwang {
	    height: 32px;
	    align-items: center;
	    display: flex;
	    justify-content: space-between;
	}
	.pcy_b {
	    font-size: 17px;
	    color: #ff4848;
	    font-weight: 700;
	}
	.pcy_rr {
	    font-size: 17px;
	    color: #1ca537;
	    font-weight: 700;
	    margin-bottom: 5px;
	}
	.xdsj{
	    color: #80817f;
	    font-size: 12px;
	}
	.meiemei {
	    width: 98%;
	    margin: auto;
	    display: flex;
	}
	.limi{
	    width: 50%;
	    color: #ea4335;
	    font-weight: 700;
	    text-align: center;
	}
</style>